<!-- 设备管理 -->
<template>
  <MainSlot v-loading="loading">
    <template v-slot:tab>
      <EnumSlot @handleEvent="getEnumEvent" :selectIndex="selectIndex" :enumList="enumList"></EnumSlot>
    </template>
    <template v-slot:btn>
      <BtnSlot :btnList="btnList" @handleEvent="getBtnEvent"></BtnSlot>
    </template>
    <template v-slot:table>
      <TableData class="tableData" :config="table_config" :tableThead="tableThead" :dataList="dataList"
        :loading="loading" @selection-change="selectionChange" @sort-change="sortChange">
        <template v-slot:control="{ row }">
          {{ row.control ? '可控' : '不可控' }}
        </template>
        <template v-slot:visible="{ row }">
          {{ row.visible ? '可展示' : '不可展示' }}
        </template>
      </TableData>
    </template>
    <template v-slot:pagination>
      <Pagination @size-Change="handleSizeChange" @current-change="handleCurrentChange" :size="size" :page="page"
        :total="total">
      </Pagination>
    </template>
    <template v-slot:dialogModule>
      <AddEdit :title="'数据项'" @closeDialog="closeDialog" :category="searchFormData.category" :enunLabel="enunLabel"
        :addEditFlag="addEditFlag" :dialogVisible="dialogVisible" :data="formData">
      </AddEdit>
    </template>
  </MainSlot>
</template>
<script>
import MainSlot from "@/components/MainSlot";
import Pagination from '@/components/Pagination';
import SearchForm from '@/components/SearchForm';
import TableData from '@/components/TableData';
import BtnSlot from '@/components/BtnSlot';
import EnumSlot from '@/components/EnumSlot';
import AddEdit from './components/addEdit.vue';
import MenuEquipment from '@/components/NavMenu/menu_equipment.vue';
import dataItemManagement from '@/api/basicInformation/dataItemManagement.js'

export default {
  components: { MainSlot, Pagination, SearchForm, TableData, BtnSlot, EnumSlot, AddEdit, MenuEquipment },
  data() {
    return {
      loading: false,
      dialogVisible: false,
      addEditFlag: 'add',
      formData: {},
      selectList: [],
      searchFormData: { category: 'SENSOR' },
      enunLabel: '水质传感器',
      page: 1,
      size: 10,
      total: 10,
      selectIndex: 0,
      btnList: ['add', 'delete'],
      enumList: [
        { type: "AIR", label: "空气数据" },
        { type: "ALARM", label: "告警指示灯数据" },
        { type: "SOIL", label: "水质数据" },
        { type: "STATE", label: "设备状态" },
        { type: "WEATHER", label: "气象站数据" },
        { type: "ATMOSPHERE", label: "气象站API" }
      ],
      dataList: [],
      tableThead: [
        { isShow: true, label: '数据项名称', prop: 'originalName' },
        { isShow: true, label: '数据类型名称', prop: 'dataItemName' },
        { isShow: true, label: '采控类型', prop: 'mainingControlType' },
        { isShow: true, label: '是否展示', slotName: 'visible' },
        { isShow: true, label: '是否可控', slotName: 'control' }
      ],
      // 配置项
      table_config: {
        isCheckBox: true,
        isOperation: true,
        // 表格操作列
        operation: {
          label: '操作',
          width: '200',
          cols: [
            {
              label: '编辑',
              type: 'primary',
              flag: 'edit',
              handleRow: this.handleRow
            },
            {
              label: '删除',
              type: 'danger',
              flag: 'delete',
              handleRow: this.handleRow
            }
          ]
        },
      }
    }
  },
  mounted() {
    this.queryPageByCondition()
  },
  methods: {
    queryPageByCondition() {
      let params = {
        page: this.page,
        size: this.size,
        entity: {
          category: this.searchFormData.category,
          organizationNo: sessionStorage.organizationNo
        }
      };
      dataItemManagement.dataItemlist(params).then(res => {
        if (res.code == 1) {
          this.dataList = res.data.content || [];
          this.total = res.data.totalElements;
          if (res.data.totalPages && this.page > res.data.totalPages) {
            this.page = res.data.totalPages;
            this.queryPageByCondition();
          }
        } else {
          this.$message.warning(res.msg || '分页查询失败')
        }
      });
    },
    // 操作方法
    handleRow(rowData, item) {
      console.log(rowData, item);
      if (item.flag == 'delete') {
        this.delList([rowData])
      } else if (item.flag == 'edit') {
        this.dialogVisible = true;
        this.formData = JSON.parse(JSON.stringify(rowData))
      }
      this.addEditFlag = item.flag
    },
    delList(deleteList = [], key = 'dataItemId') {
      let list = []
      deleteList.forEach(item => {
        list.push(item[key])
      })
      this.$confirm('此操作将永久删除该数据, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
        let res = await dataItemManagement.delListFarmingTypelist({ dataItemIdList: list });
        if (res.code == 1) {
          this.$message.success(res.msg || '删除成功');
          this.queryPageByCondition();
        } else {
          this.$message.warning(res.msg || '删除失败');
        }
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        });
      });
    },
    handleCurrentChange(page) {
      this.page = page;
      this.queryPageByCondition();
    },
    handleSizeChange(size) {
      this.size = size;
      this.queryPageByCondition();
    },
    // 多选方法
    selectionChange(val) {
      this.selectList = val
      console.log(val);
    },
    // 排序方法
    sortChange(val) {
      console.log(val);
    },
    //获取选中Enum
    getEnumEvent(enumInfo) {
      this.page = 1;
      this.selectIndex = enumInfo.index || 0;
      this.$set(this.searchFormData, 'category', enumInfo.data.type);
      this.enunLabel = enumInfo.data.label
      this.queryPageByCondition();
    },
    //获取选中Btn
    getBtnEvent(flag) {
      console.log(flag)
      if (flag == 'add') {
        this.dialogVisible = true
      } else if (flag == 'delete') {
        this.delList(this.selectList)
      }
      this.addEditFlag = flag
    },
    //关闭弹窗
    closeDialog() {
      this.dialogVisible = false;
      this.queryPageByCondition();
    },
  }
};
</script>
<style lang="scss" scoped></style>